<!doctype html>
<html>

<head>
	<meta charset="utf-8">
	<meta name="viewport"
		content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
	<meta name="format-detection" content="telephone=no" />
	<title>首页</title>
	<link rel="stylesheet" type="text/css" href="../c/aui.css" />
	<link rel="stylesheet" type="text/css" href="../c/animate.css" />
</head>
<style>
	body {
		background-color: transparent;
		/*background-color: #000;*/
	}

	.game_time {
		position: absolute;
		opacity: 0;
		margin-top: 100px;
	}

	#a {
		background: #ff7200;
		color: #fff;
		height: 80px;
		line-height: 80px;
		text-align: center;
	}
</style>
<script id="sx-list" type="text/x-dot-template">
	<style>
		.pie {
			width: {{= a}}px;
			height: {{= a}}px;
			background-color: blue;
			border-radius: 50%;
			position: absolute;
		}
		.pie1 {
			clip: rect(0px, {{= a}}px, {{= a}}px, {{= b}}px);
			-o-transform: rotate(0deg);
			-moz-transform: rotate(0deg);
			-webkit-transform: rotate(0deg);
			background-color: #fff;
		}

		.pie2 {
			clip: rect(0px, {{= b}}px, {{= a}}px, 0px);
			-o-transform: rotate(0deg);
			-moz-transform: rotate(0deg);
			-webkit-transform: rotate(0deg);
			background-color: #fff;
		}

		.hold {
			width: {{= a}}px;
			height: {{= a}}px;
			position: absolute;
			z-index: 1;
		}

		.bg {
			width: {{= a}}px;
			height: {{= a}}px;
			border-radius: {{= a}}px;
			position: absolute;
			background-color: #FE2C55;
		}
		.time {
			background-color: #fff;
			border-radius: 50%;
			position: absolute;
			z-index: 1;
			text-align: center;
			font-size: 0.8rem;
			font-weight: bold;
			color:#ff7200;
			width: {{= a-c}}px;
			height:{{= a-c}}px;
			display: flex;
			justify-content: center;
			align-items: center;
			margin-top:{{= c/2}}px;
			margin-left: {{= c/2}}px;
			border:1px solid #ff7200;
		}
		.time img {
			width: {{= a/2.2}}px;
		}
	</style>
	<div class="game_time animated fadeInDownBig" tapmode onclick="_url({url:'renwu',title:'任务系统'})">
		<div class="hold">
			<div class="pie pie1"></div>
		</div>
		<div class="hold">
			<div class="pie pie2"></div>
		</div>
		<div class="bg"> </div>
		<div class="time"><span><img src="../i/time_jinbi.png" /></span></div>
	</div>
</script>

<body>
	<!-- <div id="a" tapmode onclick="t(true)">
		暂停
	</div>
	<div id="a" tapmode onclick="t(false)">
		开始
	</div> -->
	<div id="sx-view"></div>
</body>

<script type="text/javascript" src="../j/api.js"></script>
<script type="text/javascript" src="../j/time.js"></script>
<script type="text/javascript">
	var a = 58,
		b = a / 2,
		c = 6, dongzuo_time
	apiready = function () {
		gameTime = _getPrefs('_config').time_jinbi;
		api.parseTapmode();
		var a = '';
		var evalData = doT.template($('#sx-list').html());
		$('#sx-view').html(evalData());
		api.parseTapmode();

		setTimeout(function () {
			$('.game_time').removeClass('animated fadeInDownBig');
			$('.game_time').css('opacity', '1');
			setTimeout(function () {
				login_tiao();
			}, 1000)
		}, 2000)

	}
	function login_tiao() {
		$('.game_time').addClass('animated bounce');
		setTimeout(function () {
			$('.game_time').removeClass('animated bounce');
			setTimeout(function () {
				if (_getPrefs('_user')) {
					dongzuo();
					countDown();
					return;
				}
				login_tiao();
			}, 1000)
		}, 1000)
	}
	// 动作停止
	function dongzuo() {
		clearTimeout(dongzuo_time);
		dongzuo_time = setTimeout(function () {
			// t(true);
		}, 10000)
	}
</script>

</html>